<?xml version='1.0' encoding='UTF-8' ?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">
    <f:view>
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
            <title>TRANDIO</title>
            <!--<link type="text/css" href="common/css/redmond/jquery-ui-1.8.23.custom.css" rel="stylesheet" />-->
            <!--<link type="text/css" href="../common/css/global.css" rel="stylesheet" />-->
            <link type="text/css" href="common/css/login.css" rel="stylesheet" />

            <script type="text/javascript" src="common/js/jquery-1.8.0.min.js"></script>
            <script type="text/javascript" src="common/js/jquery-ui-1.8.23.custom.min.js"></script>

            <script type="text/javascript" src="common/js/javascript.js"></script>
            <script type="text/javascript" src="common/js/login.js"></script>


            <script>
            
                $(document).ready(function() {
                    if(parseInt($("#LoginForm\\:band").val())==1){
                        //$("#errmsg").show("slow")
                        //alert("error")
                    
                        $("#errmsg").dialog({
                            resizable: false,
                            height:400,
                            width:450,
                            modal: true,
                            buttons: {                                                     
                                'OK': function() {
                                    $(this).dialog('close');  
                                    $("div#panel").animate({
                                        height: "500px"
                                    })
                                    .animate({
                                        height: "400px"
                                    }, "fast");
                                    $("div.panel_button").toggle();
                                }
                            }
                        });
                    }
                });
            
            </script>

        </head>
        <body>

            <div class="ui-widget-header ui-corner-all header">
                <center><img width="250" height="100" src="common/img/cabecera.png"/></center>
            </div>

            <div id="page_container">
                <div id="toppanel">
                    <div id="panel">

                        <div  class="panel_contents ui-widget-content"> </div>

                        <img class="border_pic ui-widget-header ui-corner-all" src="common/img/cabecera.png" alt="Logo de Soporte" />
                        <div class="login border ui-widget-header ui-corner-all" id="">

                            <h:form id="LoginForm">
                                <br />
                                <center>
                                    <table>

                                        <tr>
                                            <td align="center">
                                                <label for="sede">Sede - Centro Salud</label>
                                            </td>
                                        </tr>   



                                        <tr>
                                            <td align="center">

                                                <h:selectOneMenu style="width: 200px"   class="text ui-widget-content ui-corner-all"  id="listaSedes" value="#{loginBean.idSede}" styleClass="onselect">
                                                    <f:selectItems value="#{loginBean.listaSede}"/>
                                                </h:selectOneMenu>
                                                <input type="hidden" id="idSede" value="" />
                                            </td>
                                        </tr>    
                                        <tr>
                                            <td align="center">

                                                <label for="login">Nombre de Usuario</label> 
                                            </td>
                                        </tr>

                                        <tr>
                                            <td align="center">
                                                <h:inputText  class="text ui-widget-content ui-corner-all" id="username" value="#{loginBean.login}" styleClass="inputbox"/>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td align="center">                                                
                                                <label for="password">Contrase&ntilde;a</label>
                                            </td>
                                        </tr>

                                        <tr>
                                            <td align="center">

                                                <h:inputSecret  class="text ui-widget-content ui-corner-all" id="password" value="#{loginBean.clave}" styleClass="inputbox"/>
                                            </td>
                                        </tr>

                                        <!--<tr>
                                            <td align="center">

                                                <label for="entrar"></label>
                                            </td>
                                        </tr>-->   

                                        <tr>
                                            <td align="center">

                                                <h:commandButton styleClass="submitButton" value="Login" action="#{loginBean.validarUsuario}" class="ui-widget-content ui-corner-all"/>
                                                <h:inputHidden   id="band" value="#{loginBean.band}" styleClass="inputbox"/>
                                                <input  type="hidden"  id="band1" value="#{loginBean.band}" styleClass="inputbox"/>
                                            </td>
                                        </tr>   

                                    </table>    

                                    <!--
                                                                        <label for="entrar"></label>            
                                                                            <input type="submit" id="entrar" value="Entrar" class="ui-widget-content ui-corner-all"/>
                                    -->

                                    <!--<input  type="hidden"  id="band1" value="" styleClass="inputbox"/>-->

                                </center>
                            </h:form>


                        </div>
                    </div>

                    <div class="panel_button" style="display: block;"><img src="common/img/expand.png"  alt="expand"/> <a href="#">Login</a> </div>
                    <div class="panel_button" id="hide_button" style="display: none;"><img src="common/img/collapse.png" alt="collapse" /> <a href="#">Ocultar</a> </div>
                </div>

                <div title="Error" id="errmsg" style="color: orange;display:none">                
                    La informaci&oacute;n de nombre de usuario o <br />contraseña introducida no es correcta...!
                </div>

                <div id="content">
                    <p align="center">
                        <h1>Bienvenido al Sistema de Informaci&oacute;n Salus, la salud online.</h1>
                    </p>    


                </div>

                <br /><br /><br /><br /><br /><br />          
                <br /><br /><br /><br /><br /><br />          
                <br /><br /><br /><br />
                <div id="footer">
                    <center><p>Derechos Reservados &copy; - TRANDIO</p></center>
                </div>
            </div>
        </body>

    </f:view> 
</html>
